<!doctype html>
<html lang="ch">

    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="description" content="后台管理">
        <meta name="keywords" content="后台管理 ">
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
        <meta name="format-detection" content="telephone=no">
        <title> 后台管理</title>
        <script src="js/lib/jquery.min.js"></script>
        <script src="js/lib/bootstrap.min.js"></script>
        <script src="js/lib/bootstrapValidator.min.js"></script>
        <script src="js/lib/zh_CN.js"></script>
        <script src="js/lib/vue.min.js"></script>
        <script src="js/index.js"></script>
        <!--[if lt IE 9]>
        <script src="js/html5shiv.min.js"></script>
        <script src="js/lib/respond.min.js"></script>
        <![endif]-->
        <link href="css/bootstrap.min.css" rel="stylesheet">
        <link rel="stylesheet" type="text/css" href="css/bootstrapValidator.min.css">
        <link rel="stylesheet" type="text/css" href="css/slide.css" />
        <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" />
        <link rel="stylesheet" type="text/css" href="css/flat-ui.min.css" />
        <link rel="stylesheet" type="text/css" href="css/jquery.nouislider.css">
        <link rel="stylesheet" type="text/css" href="css/common.css" />
    </head>

    <body>
        <div id="wrap">
            <!-- 左侧菜单栏目块 -->
            <div class="leftMeun" id="leftMeun">
                <div id="logoDiv">
                    <p id="logoP"><img id="logo" alt="Police 项目" src="images/logo.png"><span>Police 项目</span></p>
                </div>
                <div class="meun-title">用户管理</div>
                <div class="meun-item meun-item-active" href="#user" aria-controls="char" role="tab" data-toggle="tab"><img src="images/icon_chara_grey.png">用户列表</div>
            </div>
            <!-- 右侧具体内容栏目 -->
            <div id="rightContent">
                <a class="toggle-btn" id="nimei">
                    <i class="glyphicon glyphicon-align-justify"></i>
                </a>
                <!-- Tab panes -->
                <div class="tab-content">
                    <!-- 用户列表模块 -->
                    <div role="tabpanel" class="tab-pane active" id="user">

                        <div class="check-div form-inline">
                            <div class="col-xs-3">
                                <button class="btn btn-yellow btn-xs js-addUser" data-toggle="modal" data-target="#addUser">添加用户 </button>
                            </div>
                            <div class="col-xs-4">
                                <input type="text" class="form-control input-sm js-searchKey" placeholder="输入用户名或手机号码搜索">
                                <button class="btn btn-white btn-xs js-callRecord-search">查 询 </button>
                            </div>
                            <div class="col-lg-3 col-lg-offset-2 col-xs-4" style=" padding-right: 40px;text-align: right;">
                                <!--<label>排序:&nbsp;</label>
                                <select class=" form-control">
                                    <option>手机型号</option>
                                    <option>IMEI</option>
                                    <option>位置</option>
                                    <option>经纬度</option>
                                </select>-->
                            </div>
                        </div>

                        <div class="data-div">
                            <div class="row tableHeader">
                                <div class="col-lg-2 col-md-2 col-sm-2 col-xs-2 ">
                                    姓名
                                </div>
                                <div class="col-lg-2 col-md-2 col-sm-2 col-xs-2 ">
                                    手机号
                                </div>
                                <div class="col-lg-2 col-md-2 col-sm-2 col-xs-2">
                                    IMEI
                                </div>
                                <div class="col-lg-3 col-md-3 col-sm-3 col-xs-3 line-limit-length">
                                    房间号
                                </div>
                                <div class="col-lg-1 col-md-1 col-sm-1 col-xs-1">
                                    性别
                                </div>
                                <div class="col-lg col-md col-sm col-xs">
                                    操作
                                </div>
                            </div>
                            <div class="tablebody" id="userData">
                                <div class="row">
                                    <div class="col-lg-2 col-md-2 col-sm-2 col-xs-2 ">
                                        向小彬
                                    </div>
                                    <div class="col-lg-2 col-md-2 col-sm-2 col-xs-2 ">
                                        18598517880
                                    </div>
                                    <div class="col-lg-2 col-md-2 col-sm-2 col-xs-2">
                                        a000004fde90d8
                                    </div>
                                    <div class="col-lg-3 col-md-3 col-sm-3 col-xs-3 line-limit-length">
                                        123
                                    </div>
                                    <div class="col-lg-1 col-md-1 col-sm-1 col-xs-1">
                                        男
                                    </div>
                                    <div class="col-lg col-md col-sm col-xs">
                                        <button class="btn btn-danger btn-xs" data-toggle="modal" data-target="#deleteUser">删除</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <!--页码块-->
                        <footer class="footer">
                            <ul class="pagination">
                                <li>
                                    <select>
                                        <option>1</option>
                                        <option>2</option>
                                        <option>3</option>
                                        <option>4</option>
                                        <option>5</option>
                                        <option>6</option>
                                        <option>7</option>
                                        <option>8</option>
                                        <option>9</option>
                                        <option>10</option>
                                    </select>
                                    页
                                </li>
                                <li class="gray">
                                    共20页
                                </li>
                                <li>
                                    <i class="glyphicon glyphicon-menu-left">
                                    </i>
                                </li>
                                <li>
                                    <i class="glyphicon glyphicon-menu-right">
                                    </i>
                                </li>
                            </ul>
                        </footer>

                        <!--弹出添加用户窗口-->
                        <div class="modal fade" id="addUser" role="dialog" aria-labelledby="gridSystemModalLabel">
                            <div class="modal-dialog" role="document">
                                <div class="modal-content">
                                    <div class="modal-header">
                                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                                        <h4 class="modal-title" id="gridSystemModalLabel">添加用户</h4>
                                    </div>
                                    <div class="modal-body">
                                        <div class="container-fluid">
                                            <div class="addUserError js-addUserError">
                                            </div>
                                            <form class="form-horizontal"  id="addUserForm">
                                                <div class="form-group ">
                                                    <label for="userName" class="col-xs-3 control-label">姓名:</label>
                                                    <div class="col-xs-7 ">
                                                        <input type="" class="form-control input-sm duiqi" name="userName" id="userName" placeholder="">
                                                    </div>
                                                </div>
                                                <div class="form-group">
                                                    <label for="mobileNumber" class="col-xs-3 control-label">手机号:</label>
                                                    <div class="col-xs-7 ">
                                                        <input type="" class="form-control input-sm duiqi" name="mobileNumber" id="mobileNumber" placeholder="">
                                                    </div>
                                                </div>
                                                <div class="form-group">
                                                    <label for="roomNumber" class="col-xs-3 control-label">房间号:</label>
                                                    <div class="col-xs-7">
                                                        <input type="" class="form-control input-sm duiqi" name="roomNumber" id="roomNumber" placeholder="">
                                                    </div>
                                                </div>
                                                <div class="form-group">
                                                    <label class="col-xs-3 control-label">性别：</label>
                                                    <div class="col-xs-7">
                                                        <label class="control-label">
                                                            <input type="radio" checked="checked" name="sex" id="man">男</label> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                                        <label class="control-label">
                                                            <input type="radio" name="sex" id="female">女</label>
                                                    </div>
                                                </div>
                                            </form>
                                        </div>
                                    </div>
                                    <div class="modal-footer">
                                        <button type="button" class="btn btn-xs btn-white" data-dismiss="modal">取 消</button>
                                        <button type="button" class="btn btn-xs btn-green js-saveUser" data-target="#addUser">保 存</button>
                                    </div>
                                </div>
                                <!-- /.modal-content -->
                            </div>
                            <!-- /.modal-dialog -->
                        </div>

                        <!--弹出删除用户警告窗口-->
                        <div class="modal fade" id="deleteUser" role="dialog" aria-labelledby="gridSystemModalLabel">
                            <div class="modal-dialog" role="document">
                                <div class="modal-content">
                                    <div class="modal-header">
                                        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                                        <h4 class="modal-title" id="gridSystemModalLabel">提示</h4>
                                    </div>
                                    <div class="modal-body">
                                        <div class="container-fluid">
                                            确定要删除该用户？
                                        </div>
                                    </div>
                                    <div class="modal-footer">
                                        <button type="button" class="btn btn-xs btn-white" data-dismiss="modal">取 消</button>
                                        <button type="button" class="btn  btn-xs btn-danger">确定</button>
                                    </div>
                                </div>
                                <!-- /.modal-content -->
                            </div>
                            <!-- /.modal-dialog -->
                        </div>
                        <!-- /.modal -->
                    </div>
                </div>
            </div>
        </div>
        </div>
</body>

</html>
